<template>
	<div class="yh_content foSi14">
		<div class="yh_topsearch yh_dis yh_disJub" style="border: none; padding: 0px;">
			<div class="dis">
				<div class="mar-right10">
					<div class="foSi12 hei20" style="color: #787878;">报班时间</div>
					<div class="dis disAl">
						<el-date-picker size="small" v-model="search.start" style="width: 140px;" type="date" placeholder="开始时间" />
						<el-date-picker size="small" v-model="search.end" class="mar-left10" style="width: 140px;" type="date"
							placeholder="截止时间" />
					</div>
				</div>
				<div class="mar-right10">
					<div class="foSi12 hei20" style="color: #787878;">状态</div>
					<el-select v-model="search.state" style="width: 140px" size="small">
						<el-option v-for="(item,index) in search.stateList" :key="index" :label="item.label"
							:value="item.value" />
					</el-select>
				</div>
				<div class="mar-right10">
					<div class="foSi12 hei20" style="color: #787878;">会员</div>
					<el-input v-model="search.name" size="small" style="width: 140px;" placeholder="姓名/手机号" />
				</div>
				<div class="mar-right10">
					<div class="foSi12 hei20" style="color: #787878;">班级名称</div>
					<el-input v-model="search.name" size="small" style="width: 140px;" placeholder="班级名称" />
				</div>
				<div>
					<el-button type="primary" class="bac6b7 mar-top20" size="small">搜索</el-button>
				</div>
			</div>
			<div class="dis mar-top20">
				<el-button type="primary" class="bac6b7 mar-right10" size="small" @click.stop="addVisible = true">新增报班</el-button>
				<router-link :to="'/course/classMemberImport'">
					<el-button type="primary" class="bac6b7" size="small">批量导入</el-button>
				</router-link>
			</div>
		</div>
		<div style="margin-top: 20px">
			<el-table :data="tableData" v-loading="listLoading" stripe style="width: 100%">
				<div slot="empty" class="m-empty-box">
					<div class="mar" style="width: 168px;height: 180px;">
						<img src="https://www.jianyigongxiang.com/public/membercard/empty.png" class="wh100" />
					</div>
					<div class="title">暂无数据</div>
				</div>
				<el-table-column prop="member_name" label="会员姓名" />
				<el-table-column prop="member_tel" label="电话	" />
				<el-table-column prop="class_name" label="班级" />
				<el-table-column prop="money" label="收费金额" />
				<el-table-column prop="consume_class_hour" label="已消耗课时" />
				<el-table-column prop="surplus_class_hour" label="剩余课时" />
				<el-table-column prop="class_hour" label="总课时" />
				<el-table-column prop="createtime" label="报班时间" />
				<el-table-column prop="money" label="状态" >
          <template slot-scope="scope">
            {{scope.row.go_out == 0?'正常':'出班'}}
          </template>
        </el-table-column>
				<el-table-column label="操作	" width="280">
					<template slot-scope="scope">
            <div class="dis disAl flwa">
              <div class="dis disAl mar-right10 cuPo mar-bott5" @click="xiangqing(scope.row.id)">
                <i class="el-icon-document" style="color: rgb(25, 165, 88); font-size: 20px" />详情
              </div>
              <div class="dis disAl mar-right10 mar-bott5" @click="xuban(scope.row.id)">
                <i class="el-icon-document" style="color: #41c3a8; font-size: 20px" />续班
              </div>
              <div class="dis disAl mar-right10 cuPo mar-bott5" @click="chuban(scope.row.id)">
                <i class="el-icon-document" style="color: #41c3a8; font-size: 20px" />出班
              </div>
<!--              <div class="dis disAl mar-right10 cuPo mar-bott5" @click="baoban(scope.row.id)">-->
<!--                <i class="el-icon-document" style="color: #41c3a8; font-size: 20px" />转班-->
<!--              </div>-->
<!--              <div class="dis disAl mar-right10 cuPo mar-bott5" @click="baoban(scope.row.id)">-->
<!--                <i class="el-icon-document" style="color: #41c3a8; font-size: 20px" />分课-->
<!--              </div>-->
<!--              <div class="dis disAl mar-right10 cuPo mar-bott5" @click="baoban(scope.row.id)">-->
<!--                <i class="el-icon-chat-dot-round" style="color: rgb(25, 165, 88); font-size: 20px" />更多-->
<!--              </div>-->
            </div>

          </template>
				</el-table-column>
			</el-table>
			<pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit"
				@pagination="getList" />
		</div>
		<div v-if="addVisible || is_xuban_show || is_chuban_show" class="zhezhao wh100"></div>
		<div v-if="addVisible" class="zhezhaoN dis disAl disJuC wh100">
			<div class="poRel borRad10 bacFFF zhezhaoWH" style="width: 962px;">
				<div class="wid90 mar">
					<div class="wid100 dis disAl disJuB" style="padding: 30px 0 10px;border-bottom: 1px solid #d9d9d9;">
						<div class="dis disAl">
							<div class="foSi20 fowe600 mar-right10">报班</div>
						</div>
						<svg-icon icon-class="guanbi" class="mar0 cuPo" @click.stop="addVisibleClick()"
							style="color: #ACACAC;width: 24px;height: 24px;" />
					</div>
					<div class="mar-top20">
						<div class="foSi12 titl">报班信息</div>
						<el-form :model="ruleForm" :rules="rules" ref="ruleForm">
							<div class="wid100 item-l hei44 mar-bott10 dis disAl">
								<div class="hei100 item-bor item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>手机</span>
									</div>
									<el-form-item class="mp0" prop="tel">
										<el-input v-model="ruleForm.tel" style="width: 140px;" placeholder="请填写手机号码" />
									</el-form-item>
								</div>
								<div class="hei100 item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>姓名</span>
									</div>
									<el-form-item class="mp0" prop="name">
										<el-input v-model="ruleForm.name" style="width: 140px;" placeholder="请填写姓名" />
									</el-form-item>
								</div>
							</div>
							<div class="wid100 item-l hei44 mar-bott10 dis disAl">
								<div class="hei100 item-bor item-p item-w dis disAl disJuB">
									<div>生日</div>
									<el-date-picker v-model="ruleForm.birthday" style="width: 140px;" type="date"
										placeholder="请选择" :picker-options="{disabledDate:dateOptions}" />
								</div>
								<div class="hei100 item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>班级</span>
									</div>
									<el-form-item class="mp0" prop="grade">
										<el-select v-model="ruleForm.grade" style="width: 140px" placeholder="请选择">
											<el-option v-for="(item,index) in gradeList" :key="index"
												:label="item.label" :value="item.value" />
										</el-select>
									</el-form-item>
								</div>
							</div>
							<div class="wid100 item-l hei44 mar-bott10 dis disAl">
								<div class="hei100 item-bor item-p item-w dis disAl disJuB">
									<div>班级课时</div>
									<div>班级课时</div>
								</div>
								<div class="hei100 item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>实际课时</span>
									</div>
									<el-form-item class="mp0" prop="actual">
										<el-input v-model="ruleForm.actual" style="width: 140px;"
											placeholder="请输入课时数量" />
									</el-form-item>
								</div>
							</div>
							<div class="wid100 item-l hei44 mar-bott10 dis disAl">
								<div class="hei100 item-bor item-p item-w dis disAl disJuB">
									<div>入班日期</div>
									<el-date-picker v-model="ruleForm.enterClass" style="width: 140px;" type="date"
										placeholder="请选择" />
								</div>
								<div class="hei100 item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>有效期</span>
									</div>
									<div class="dis disAl">
										<div class="dis disAl cuPo" @click.stop="ruleForm.validity = 1">
											<div class="dis disAl disJuC bacFFF borRad50"
												style="width: 14px;height: 14px;border: 1px solid #6b7cdd;">
												<div v-if="ruleForm.validity === 1" class="borRad50"
													style="width: 6px;height: 6px;background: #6b7cdd;"></div>
											</div>
											<div class="mar-left5">长期有效</div>
										</div>
										<div class="dis disAl cuPo mar-left30" @click.stop="ruleForm.validity = 2">
											<div class="dis disAl disJuC bacFFF borRad50"
												style="width: 14px;height: 14px;border: 1px solid #6b7cdd;">
												<div v-if="ruleForm.validity === 2" class="borRad50"
													style="width: 6px;height: 6px;background: #6b7cdd;"></div>
											</div>
											<div class="mar-left5">设置有效期</div>
										</div>
									</div>
								</div>
							</div>
							<div class="wid100 item-l hei44 mar-bott10 dis disAl">
								<div class="hei100 item-bor item-p item-w dis disAl disJuB">
									<div>参考售价（元）</div>
									<div></div>
								</div>
								<div v-if="ruleForm.validity === 2" class="hei100 item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>到期日期</span>
									</div>
									<el-form-item class="mp0" prop="expireTime">
										<el-date-picker v-model="ruleForm.expireTime" style="width: 140px;" type="date"
											placeholder="请选择" :picker-options="{disabledDate:dateOptions1}" />
									</el-form-item>
								</div>
							</div>
							<div class="wid100 item-l hei44 mar-bott10 dis disAl">
								<div class="hei100 item-bor item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>支付方式</span>
									</div>
									<el-form-item class="mp0" prop="payment">
										<el-select v-model="ruleForm.payment" style="width: 140px" placeholder="请选择">
											<el-option v-for="(item,index) in paymentList" :key="index"
												:label="item.label" :value="item.value" />
										</el-select>
									</el-form-item>
								</div>
								<div class="hei100 item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>实收金额（元）</span>
									</div>
									<el-form-item class="mp0" prop="receivedReceipts ">
										<el-input v-model="ruleForm.receivedReceipts " style="width: 140px;"
											placeholder="请输入金额" />
									</el-form-item>
								</div>
							</div>
							<div v-if="ruleForm.payment === 43" class="wid100 item-l hei44 mar-bott10 dis disAl">
								<div class="hei100 item-bor item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>储值卡支付金额（元）</span>
									</div>
									<el-form-item class="mp0" prop="cardaAmount">
										<el-input v-model="ruleForm.cardaAmount" style="width: 140px;"
											placeholder="请输入金额" />
									</el-form-item>
								</div>
								<div class="hei100 item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>储值卡选择</span>
									</div>
									<el-form-item class="mp0" prop="cardaName">
										<el-input v-model="ruleForm.cardaName " style="width: 140px;"
											placeholder="姓名/手机号/卡号" />
									</el-form-item>
								</div>
							</div>
						</el-form>
					</div>
					<div class="wid100 dis disAl disJuC foSi14 coFFF" style="padding: 20px 0 40px">
						<div class="mar-right20 que cuPo" @click.stop="submitForm('ruleForm')">保存</div>
						<div class="que cuPo" style="background: #616b74;" @click.stop="addVisibleClick()">取消</div>
					</div>
				</div>
			</div>
		</div>
    <div v-if="is_xuban_show" class="zhezhaoN dis disAl disJuC wh100">
			<div class="poRel borRad10 bacFFF zhezhaoWH" style="width: 962px;">
				<div class="wid90 mar">
					<div class="wid100 dis disAl disJuB" style="padding: 30px 0 10px;border-bottom: 1px solid #d9d9d9;">
						<div class="dis disAl">
							<div class="foSi20 fowe600 mar-right10">续班</div>
						</div>
						<svg-icon icon-class="guanbi" class="mar0 cuPo" @click.stop="xubanClose()"
							style="color: #ACACAC;width: 24px;height: 24px;" />
					</div>
					<div class="mar-top20">
						<div class="foSi12 titl">续班信息</div>
						<el-form :model="xubanForm" :rules="rules" ref="ruleForm">
							<div class="wid100 item-l hei44 mar-bott10 dis disAl">
								<div class="hei100 item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>姓名</span>
									</div>
                  {{xubanForm.member_name}}
								</div>
                <div class="hei100 item-p item-w dis disAl disJuB">
                  <div class="dis disAl">
                    <span class="mar-right5" style="color: #FF0000;">*</span>
                    <span>班级</span>
                  </div>
                  {{xubanForm.class_name}}
                </div>
							</div>
							<div class="wid100 item-l hei44 mar-bott10 dis disAl">
								<div class="hei100 item-bor item-p item-w dis disAl disJuB">
									<div>剩余课时</div>
									<div>{{ xubanForm.surplus_class_hour }}</div>
								</div>
								<div class="hei100 item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>续班课时</span>
									</div>
									<el-form-item class="mp0" prop="actual">
										<el-input v-model="xubanForm.class_hour" style="width: 140px;"
											placeholder="请输入续班课时" />
									</el-form-item>
								</div>
							</div>

							<div class="wid100 item-l hei44 mar-bott10 dis disAl">
								<div class="hei100 item-bor item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>支付方式</span>
									</div>
									<el-form-item class="mp0" prop="payment">
										<el-select v-model="xubanForm.money_type" style="width: 140px" placeholder="请选择">
											<el-option v-for="(item,index) in paymentList" :key="index"
												:label="item.label" :value="item.value" />
										</el-select>
									</el-form-item>
								</div>
								<div class="hei100 item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>续班金额（元）</span>
									</div>
									<el-form-item class="mp0" prop="receivedReceipts ">
										<el-input v-model="xubanForm.money " style="width: 140px;"
											placeholder="请输入续班金额" />
									</el-form-item>
								</div>
							</div>
							<div v-if="ruleForm.payment === 43" class="wid100 item-l hei44 mar-bott10 dis disAl">
								<div class="hei100 item-bor item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>储值卡支付金额（元）</span>
									</div>
									<el-form-item class="mp0" prop="cardaAmount">
										<el-input v-model="ruleForm.cardaAmount" style="width: 140px;"
											placeholder="请输入金额" />
									</el-form-item>
								</div>
								<div class="hei100 item-p item-w dis disAl disJuB">
									<div class="dis disAl">
										<span class="mar-right5" style="color: #FF0000;">*</span>
										<span>储值卡选择</span>
									</div>
									<el-form-item class="mp0" prop="cardaName">
										<el-input v-model="ruleForm.cardaName " style="width: 140px;"
											placeholder="姓名/手机号/卡号" />
									</el-form-item>
								</div>
							</div>
						</el-form>
					</div>
					<div class="wid100 dis disAl disJuC foSi14 coFFF" style="padding: 20px 0 40px">
						<div class="mar-right20 que cuPo" @click.stop="getxuban">保存</div>
						<div class="que cuPo" style="background: #616b74;" @click.stop="xubanClose()">取消</div>
					</div>
				</div>
			</div>
		</div>
    <div v-if="is_chuban_show" class="zhezhaoN dis disAl disJuC wh100">
      <div class="poRel borRad10 bacFFF zhezhaoWH" style="width: 962px;">
        <div class="wid90 mar">
          <div class="wid100 dis disAl disJuB" style="padding: 30px 0 10px;border-bottom: 1px solid #d9d9d9;">
            <div class="dis disAl">
              <div class="foSi20 fowe600 mar-right10">出班</div>
            </div>
            <svg-icon icon-class="guanbi" class="mar0 cuPo" @click.stop="chubanclose()"
                      style="color: #ACACAC;width: 24px;height: 24px;" />
          </div>
          <div class="mar-top20">
            <div class="foSi12 titl">出班信息</div>
            <el-form :model="chubanForm" ref="ruleForm">
              <div class="wid100 item-l hei44 mar-bott10 dis disAl">
                <div class="hei100 item-p item-w dis disAl disJuB">
                  <div class="dis disAl">
                    <span class="mar-right5" style="color: #FF0000;">*</span>
                    <span>姓名</span>
                  </div>
                  {{chubanForm.member_name}}
                </div>
                <div class="hei100 item-p item-w dis disAl disJuB">
                  <div class="dis disAl">
                    <span class="mar-right5" style="color: #FF0000;">*</span>
                    <span>班级</span>
                  </div>
                  {{chubanForm.class_name}}
                </div>
              </div>
              <div class="wid100 item-l hei44 mar-bott10 dis disAl">
                <div class="hei100 item-bor item-p item-w dis disAl disJuB">
                  <div>剩余课时</div>
                  <div>{{ chubanForm.surplus_class_hour }}</div>
                </div>
                <div class="hei100 item-p item-w dis disAl disJuB">
                  <div class="dis disAl">
                    <span class="mar-right5" style="color: #FF0000;">*</span>
                    <span>是否退费</span>
                  </div>
                  <el-form-item class="mp0" prop="yxq">
                    <el-radio-group v-model="chubanForm.refund_status" @change="$forceUpdate()">
                      <el-radio label="0">是</el-radio>
                      <el-radio label="1">否</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </div>
              </div>

              <div class="wid100 item-l hei44 mar-bott10 dis disAl" v-if="chubanForm.refund_status == '0'">
                <div class="hei100 item-bor item-p item-w dis disAl disJuB">
                  <div class="dis disAl">
                    <span class="mar-right5" style="color: #FF0000;">*</span>
                    <span>退费路径</span>
                  </div>
                  <el-form-item class="mp0" prop="payment">
                    <el-select v-model="chubanForm.money_type" style="width: 140px" placeholder="请选择">
                      <el-option v-for="(item,index) in paymentList" :key="index"
                                 :label="item.label" :value="item.value" />
                    </el-select>
                  </el-form-item>
                </div>
                <div class="hei100 item-p item-w dis disAl disJuB">
                  <div class="dis disAl">
                    <span class="mar-right5" style="color: #FF0000;">*</span>
                    <span>退费金额（元）</span>
                  </div>
                  <el-form-item class="mp0" prop="receivedReceipts ">
                    <el-input v-model="chubanForm.money " style="width: 140px;"
                              placeholder="请输入续班金额" />
                  </el-form-item>
                </div>
              </div>
            </el-form>
          </div>
          <div class="wid100 dis disAl disJuC foSi14 coFFF" style="padding: 20px 0 40px">
            <div class="mar-right20 que cuPo" @click.stop="getchuban">保存</div>
            <div class="que cuPo" style="background: #616b74;" @click.stop="chubanclose()">取消</div>
          </div>
        </div>
      </div>
    </div>


  </div>
</template>

<script>
	import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
	import {
		getXuan,
		judgeButton
	} from '@/utils/limits.js'
  import {
    getClassMember, getInfo,getXuban,getXubanAddedit,getChubanAddedit
  } from '@/api/class.js';
	import {
		mapGetters
	} from 'vuex'
	import {
		validTel
	} from '@/utils/validate'
	export default {
		name: 'classMember',
		components: {
			Pagination
		},
		data() {
			const validateTel = (rule, value, callback) => {
				if (!validTel(value)) {
					callback(new Error('请填写手机号'))
				} else {
					callback()
				}
			}
			const validateExpire = (rule, value, callback) => {
				if (this.ruleForm.validity === 2 && !value) {
					callback(new Error('请选择'))
				} else {
					callback()
				}
			}
			const validateReceived = (rule, value, callback) => {
				var reg = new RegExp('^-?[0-9]*.?[0-9]*$')
				if (!reg.test(value) || !value || value > 999999999.99 || value < 0.01) {
					callback(new Error('请输入金额（支持两位小数）'))
				} else {
					callback()
				}
			}
			const validateCardaAmount = (rule, value, callback) => {
				var reg = new RegExp('^-?[0-9]*.?[0-9]*$')
				var len = 0
				if (this.ruleForm.payment === 43) {
					if (value) {
						var tem = value.toString().split('.')
						len = tem.length >= 2 ? tem[1].length : 0;
					}
					if (!reg.test(value) || !value || len > 2 || value < 0.01) {
						callback(new Error('请输入数值,最小单位为分'))
					} else {
						callback()
					}
				} else {
					callback()
				}
			}
			const validateCardaName = (rule, value, callback) => {
				if (this.ruleForm.payment === 43 && !value) {
					callback(new Error('请先选择用于支付的储值卡'))
				} else {
					callback()
				}
			}

			return {
        id:0,
        is_xuban_show:false,
        is_chuban_show:false,
				addVisible: false,
				list: null,
				total: 0,
				listLoading: false,
				search: {
					stateList: [{
						value: '0',
						label: '全部'
					}, {
						value: '1',
						label: '上架'
					}, {
						value: '2',
						label: '下架'
					}], // 状态
					start: '',
					end: '',
					name: ''
				},
				tableData: null,
				listQuery: {
					page: 1,
					limit: 0
				},
        xubanForm:{},
        chubanForm: {
          refund_status: "0"
        },
				ruleForm: {
					tel: null,
					name: null,
					birthday: null,
					grade: null,
					actual: null,
					enterClass: null,
					validity: 1,
					expireTime: null,
					payment: null,
					receivedReceipts: null,
					cardaAmount: null,
					cardaName: null,
				},
				// rules: {
				// 	tel: [{
				// 		required: true,
				// 		trigger: 'blur',
				// 		validator: validateTel
				// 	}],
				// 	name: [{
				// 		required: true,
				// 		trigger: 'blur',
				// 		message: '请选择课程类型',
				// 	}],
				// 	grade: [{
				// 		required: true,
				// 		trigger: 'change',
				// 		message: '请选择课程类型',
				// 	}],
				// 	actual: [{
				// 		required: true,
				// 		trigger: 'blur',
				// 		message: '请输入课时数量',
				// 	}],
				// 	expireTime: [{
				// 		required: true,
				// 		trigger: 'change',
				// 		validator: validateExpire
				// 	}],
				// 	payment: [{
				// 		required: true,
				// 		trigger: 'change',
				// 		message: '请选择支付方式',
				// 	}],
				// 	receivedReceipts: [{
				// 		required: true,
				// 		trigger: 'blur',
				// 		validator: validateReceived
				// 	}],
				// 	cardaAmount: [{
				// 		required: true,
				// 		trigger: 'blur',
				// 		validator: validateCardaAmount
				// 	}],
				// 	cardaName: [{
				// 		required: true,
				// 		trigger: 'blur',
				// 		validator: validateCardaName
				// 	}],
				// },
				gradeList: [{
					label: '次数',
					value: 1
				}],
				paymentList: [
          {
            label: '请选择',
            value: 0
          }, {
            label: '商户扫码(微信/支付宝/云闪付)',
            value: 1
          }, {
            label: '用户扫码(收付款)',
            value: 2
          }, {
            label: '现金支付',
            value: 3
          }, {
            label: '储值卡支付',
            value: 4
          }, {
            label: '线下支付(银行卡)',
            value: 5
          }, {
            label: '线下支付(微信)',
            value: 6
          }, {
            label: '线下支付(支付宝)',
            value: 7
          }, {
            label: '线下支付(其他)',
            value: 8
          }
				],
				// 选择今天及今天以后的日期
				dateOptions(time) {
					return time.getTime() >= Date.now() - 8.64e6;
				},
				dateOptions1(time) {
					return time.getTime() < Date.now() - 8.64e7;
				},

			}
		},
		computed: {
			...mapGetters([
				'permission_routes',
				'roles'
			])
		},
		created() {
			var xuanList = [{
				name: '班级管理',
				url: '/course/classPrivateList',
				pd: true
			}, {
				name: '班课课程管理',
				url: '/course/courseTeam',
				pd: true
			}, {
				name: '班课课程表',
				url: '/course/courseSurfaceClass',
				pd: true
			}, {
				name: '班课会员管理',
				url: '/course/classMember',
				pd: true
			}, {
				name: '班课数据统计',
				url: '/course/classPrivateData',
				pd: true
			}]
			var xuanList1 = getXuan(xuanList, this.roles)
			this.$store.dispatch('user/changeXuan', {
				key: 'xuanList',
				value: xuanList1
			})
			this.$store.dispatch('user/changeXuan', {
				key: 'xuan',
				value: 3
			})
			this.getList()
		},
		methods: {
      xubanClose(){
        this.xubanForm = {};
        this.is_xuban_show = false
        this.id = 0
      },
      chubanclose(){
        this.chubanForm = {refund_status: "0"};
        this.is_chuban_show = false
        this.id = 0
      },
      xuban(id){
        this.is_xuban_show = true
        this.id = id
        getXuban({'id':id}).then(response => {
            const {
              data
            } = response
            console.log(data);
            this.xubanForm = data
        }).catch(error => {
          console.log(error)
        })
      },
      getxuban(){
        getXubanAddedit(this.xubanForm).then(response => {
          const {
            data
          } = response
          console.log(data);
          this.xubanForm = {};
          this.is_xuban_show = false
          this.id = 0
          this.getList()
        }).catch(error => {
          console.log(error)
        })
      },
      getchuban(){
        getChubanAddedit(this.chubanForm).then(response => {
          const {
            data
          } = response
          console.log(data);
          this.chubanForm = {refund_status: "0"};
          this.is_chuban_show = false
          this.id = 0
          this.getList()
        }).catch(error => {
          console.log(error)
        })
      },
      chuban(id){
        this.is_chuban_show = true
        this.id = id
        getXuban({'id':id}).then(response => {
          const {
            data
          } = response
          console.log(data);
          this.chubanForm = data
          this.chubanForm.refund_status = "0";
          console.log(this.chubanForm);
        }).catch(error => {
          console.log(error)
        })
      },
			xiangqing(id) {
				console.log(id)
				this.$router.push({
					path: '/course/classMemberInfo?id=' + id
				})
			},
			edit(id) {
				console.log(id)
				this.$router.push({
					path: '/course/classPrivateEdit?id=' + id
				})
			},
			addVisibleClick() {
				this.addVisible = false
				this.ruleForm = {
					tel: null,
					name: null,
					birthday: null,
					grade: null,
					actual: null,
					enterClass: null,
					validity: 1,
					expireTime: null,
					payment: null,
					receivedReceipts: null,
					cardaAmount: null,
					cardaName: null,
				}
			},
			submitForm(formName) {
				this.$refs[formName].validate((valid) => {
					if (valid) {
						this.addVisibleClick()
					} else {
						this.$message.error('请按规则填写完整信息')
						return false
					}
				})
			},
			getList() {
				this.listLoading = true
				this.total = 0
				this.tableData = []
				this.listLoading = false

        getClassMember(this.search).then(response => {
          const {
            data
          } = response
          console.log(data)
          this.tableData = data.data;
        }).catch(error => {
          console.log(error)
        })
			}
		}
	}
</script>

<style lang="scss" scoped>
	.yh_content {
		padding: 20px;
	}

	.yh_topsearch {
		border: 1px solid #ccc;
		padding: 20px 20px 0px 20px;
	}

	.yh_dis {
		display: flex;
	}

	.yh_disAlc {
		align-items: center;
	}

	.topsearch_item {
		/* padding: 20px; */
	}

	.search_left {
		width: 150px;
		font-size: 12px;
		color: #838383;
	}

	.search_right {
		flex-wrap: wrap;
	}

	.sons {
		margin-left: 20px;
		cursor: pointer;
		font-size: 12px;
		margin-bottom: 15px;
	}

	.choiceme {
		color: #6b7cdd;
		font-size: 12px;
	}

	.yh_xian {
		border-bottom: 1px solid #e7e7e7;
		/* width: 98%; */
		margin: 0px auto;
		margin-bottom: 20px;
	}

	.yh_qs {
		color: #838383;
	}

	.yh_disJub {
		justify-content: space-between;
	}

	.yh_disJuc {
		justify-content: center;
	}

	.yh_font12 {
		font-size: 12px;
	}

	.yh_font13 {
		font-size: 13px;
	}

	::v-deep .el-input__inner {
		height: 32px;
		line-height: 32px;
	}

	.que {
		display: inline-block;
		padding: 0 24px;
		height: 34px;
		line-height: 34px;
		text-align: center;
		vertical-align: top;
	}

	.item-l {
		background: #f2f2f2;
	}

	.item-p {
		padding: 0 15px;
	}

	.item-w {
		width: 433px;
	}

	.item-bor {
		border-right: 2px solid #fff;
	}

	.titl {
		height: 22px;
		color: #787878;
	}
</style>
